﻿
<link href="~/lib/layui/css/layui.css" rel="stylesheet" />   @* 一 ①样式 *@ @* ②layui js库 *@
<script src="~/js/js.cookie.js"></script>
<script src="~/js/moment.js"></script>
<script src="~/lib/layui/layui.js"></script>
<script src="~/lib/jquery/dist/jquery.js"></script>

<h2>订单列表</h2>


<table class="layui-table">
    <tr>
        <td>订单编号</td>
        <td>用户名</td>
        <td>房间名称</td>
        <td>房间数量</td>
        <td>单价</td>
        <td>支付方式</td>
        <td>总价</td>
        <td>人脸图片</td>
        <td>特殊需求</td>
        <td>订单状态</td>
        <td>操作</td>
    </tr>
    <tbody id="data"></tbody>
</table>
<div id="demo-laypage-all"></div>
<script>

    $(function () {
        Fenye();
    });


    var index = 1;
    var size = 3;
    var count = 0;
    function showOrders() {
        $.ajax({
            url: 'https://localhost:7061/api/Order/GetOrders?index=' + index + '&size=' + size,
            type: 'get',
            async: false,
            success: function (res) {
                console.log(res);
                var tr = '';
                $(res.data).each(function (i, obj) {
                    tr += `    <tr><td>${obj.userName}</td>
                                    <td> ${obj.orderCode} </td>
                                    <td> ${obj.roomName} </td>
                                    <td> ${obj.roomCount} </td>
                                    <td> ${obj.price} </td>
                                    <td> ${obj.paymentMethod} </td>
                                    <td> ${obj.totalPrice} </td>
                                    <td> <img src="${obj.imgUrl}">  </td>
                                    <td> ${obj.teshu}</td>
                                        <td> ${obj.orderStatusEnum==0?"待支付":"已支付"}</td>
                                    <td> <input type="button" onclick='LjDel(${obj.id})' value='逻辑删除'>
                                           <input type="button" onclick='ZhiFu(${obj.id})' value='支付'>  </td>
                                    </tr>  `;
                });
                $("#data").html(tr);
                count = res.count;
            }
        });


    }

    function Fenye() {
        var laypage = layui.laypage;
        showOrders();
        // 完整显示
        laypage.render({
            elem: 'demo-laypage-all', // 元素 id
            count: count, // 数据总数
            limit: size,
            limits: [2, 3, 4, 5],
            layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip'], // 功能布局
            jump: function (obj) {
                console.log(obj);
                index = obj.curr;
                size = obj.limit;
                showOrders();
            }
        });
    }

    function LjDel(id) {

        $.ajax({
            url: 'https://localhost:7061/api/Order/LjDel?id='+id,
            type:'put',
            success: function (res) { 
                if (res > 0) {
                    Fenye();
                    alert("删除成功.");
                    
                } else {
                    alert("删除失败!");
                }
            }
            });

    }
    function ZhiFu(id) {

        $.ajax({
            url: 'https://localhost:7061/api/Order/ZhiFu?id=' + id,
            type:'put',
            success: function (res) { 
                if (res > 0) {
                    Fenye();
                    alert("支付成功.");
                    
                } else {
                    alert("支付失败!");
                }
            }
            });

    }

</script>